<template>
    <div class="fullScreen">
        <m-header :msg="'设置'"></m-header>
        <div class="he-fv bg-c-wh tx-s-14 tx-c-222">
            <div class="flex-box flex-pj line-box bor-b-g">
                <div class="flex-box flex-f1 flex-pj">
                    <div>版本号</div>
                    <div>版本号</div>
                </div>
                <div class="arrow_right mar-l"></div>
            </div>
            <div class="flex-box flex-pj line-box bor-b-g">
                <div class="flex-box flex-f1 flex-pj">
                    <div>关于</div>
                </div>
                <div class="arrow_right mar-l"></div>
            </div>
            <div class="flex-box flex-pj line-box bor-b-g">
                <div class="flex-box flex-f1 flex-pj">
                    <div>缓存</div>
                    <div>kb</div>
                </div>
                <div class="arrow_right mar-l"></div>
            </div>
            <div class="submit-btn mar-btn" @click="logOut">退出登录</div>
        </div>
    </div>
</template>
<script type="text/ecmascript-6">
import 'common/css/user.css'
import { delCookie } from '../../common/js/cookie'
import MHeader from '../../components/m-header'
export default {
    data () {
        return {
        }
    },
    methods: {
        logOut () {
            const _this = this // 需要注意 onCancel 和 onConfirm 的 this 指向
            this.$vux.confirm.show({
                // 组件除show外的属性
                content: '确定退出当前帐号？',
                hideOnBlur: true,
                onCancel () {
                },
                onConfirm () {
                    // 清除缓存 
                    delCookie('userInfo') 
                    sessionStorage.clear()
                    // 更新store数据
                    _this.$store.commit('SET_USERINFO')
                    _this.$router.go(-1) 
                }
            })
        }
    },
    components: {
        MHeader
    }
}
</script>
<style scoped lang="stylus" rel="stylesheet/stylus">
    .scroll-box
        position: fixed
        width: 100%
        top: 2.75rem
        bottom: 0
        background: white
        overflow: auto
    .scroll-box::-webkit-scrollbar
        display: none
    .line-box
        padding: 1rem 0
        margin: 0 1rem
    .mar-l
        margin-left: .75rem
    .mar-btn
        margin: 4rem 1rem 0 1rem
</style>

